﻿<!DOCTYPE html>
<html lang="en">

	<head>
		<meta http-equiv="content-type" content="text/html; charset=UTF-8">
		<meta charset="utf-8">
		<title></title>
		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1, user-scalable=no">
		<meta name="description" content="">
		<meta name="author" content="">
		<!-- STYLESHEETS -->
		<!--[if lt IE 9]><script src="../../js/flot/excanvas.min.js"></script><script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script><script src="http://css3-mediaqueries-js.googlecode.com/svn/trunk/css3-mediaqueries.js"></script><![endif]-->
		<link rel="stylesheet" type="text/css" href="../../css/cloud-admin.css">
		<link rel="stylesheet" type="text/css" href="../../css/themes/default.css" id="skin-switcher">
		<link rel="stylesheet" type="text/css" href="../../css/responsive.css">
		<link href="../../font-awesome/css/font-awesome.min.css" rel="stylesheet">
	    <!-- file-input -->
	    <link rel="stylesheet" type="text/css" href="../../js/file-input/fileinput.css" />
		<!-- SELECT2 -->
	<link rel="stylesheet" type="text/css" href="../../js/select2/select2.min.css" />
		<!-- datatable -->
		<link rel="stylesheet" href="../../js/datatables/datatable.css">
		 <link rel="stylesheet" href="../../js/datepicker/datepicker.css">
		   <style type="text/css">
		   
		   .in_A .swiper-container{width:100%;height:auto;}
.in_B{padding:1.125rem;overflow: hidden;}
.in_B li{width:25%;display:block;float:left;}

.in_C{height:auto;width:100%; overflow:hidden;}
.in_C dt{/*width:7.075rem;*/width:37.733%; position: relative;float: left;}
.in_C dt .seckill{position:absolute;top:0.5rem;left:0.5rem;}
.in_C dt .seckill .time{font-size:0.75rem;color:#333;padding-left:0.2rem;}
.in_C dt .seckill .seck{font-size:0.55rem;}
.in_C dt .seckill .seck span{color:#808080;padding-left:0.2rem;}
.in_C dt .seckill .seck .sec{width:3.5rem;height:0.875rem;background:#fff;border-radius:0.75rem;border:#7a6a56 solid 2px;font-size:0.65rem; text-align: center; line-height:0.875rem;color:#7a6a56;margin-top:0.1rem;}

.in_C dd{/*width:11.675rem;*/width:62.266%;float: left;}
.in_C dd p{overflow: hidden;}
.in_C dd p:first-child{width:100%;}

.in_C dd p span{float: left;}
.in_C dd p:last-child span:first-child{width:49.892%;}
.in_C dd p:last-child span:last-child{width:50.107%;}

.in_D{padding-bottom:1.5rem;}
.in_D .in_D_tit{height:2.25rem;line-height:2.25rem;font-size: 0.75rem; text-align: center;display: block;color:#333;}
.in_D .in_D_lst{width:100%;border-top:#eee solid 0.05rem;overflow: hidden;}
.in_D .in_D_lst li{border-bottom:#eee solid 0.05rem;width:25%;float:left;}
.in_D .in_D_lst li a{display:block;width:100%;border-left:#eee solid 0.05rem;}
.in_D .in_D_lst li:first-child a{border-left:#fff solid 0.05rem;}
.in_D .in_D_lst li:nth-child(5) a{border-left:#fff solid 0.05rem;}

.group-goods{}
.group-goods-banner{height:8.75rem;}
.group-goods-lst{overflow: hidden;padding:10px;}
.group-goods-lst li{width:142px;padding:10px 10px 10px 10px;float: left;} 
.group-goods-lst li h3{font-size:0.6rem;color:#808080;position:relative;padding-top:0.5rem;}
.group-goods-lst li h3 b{color:#333;font-size:0.7rem;padding-left:0.15rem;}
.group-goods-lst li h3 span{width:1.425rem;height:0.575rem;display:block;position:absolute;right: 0; top:0.7rem;} 
img{width:100%}
		   </style>
	
	</head>

<body>
	<header class="navbar clearfix" id="header">
		</header>

		<!-- PAGE -->
		<section id="page">
			<!-- SIDEBAR -->
			<div id="sidebar" class="sidebar">
				<div class="sidebar-menu nav-collapse">
	
					<ul>
						

					</ul>
					
				</div>

			</div>
			<!-- /SIDEBAR -->
			<div id="main-content">

				<div class="container">
					<div class="row">
						<div id="content" class="col-lg-12">
							
			               <div class="row">
								<div class="col-sm-12">
									<div class="page-header">
										<!-- STYLER -->

										<!-- /STYLER -->
										<!-- BREADCRUMBS -->
										<ul class="breadcrumb">
											<li>
												<i class="fa fa-home"></i>
												<a href="index.html">首页</a>
											</li>
											<li>
												<a href="#">商品管理</a>
											</li>
											<li>维护商品</li>
										</ul>
										<!-- /BREADCRUMBS -->

									</div>
								</div>
							</div>

							<div class="row">
								<div class="col-sm-12">
									<label class="control-label col-md-1" style="line-height:34px;">微信公众号：</label>
									<select class="col-md-2 select2-offscreen" id="platformNo" name="platformNo">
										<option value="M000" selected="selected">壹果Yiigoo</option>
										<option value="M001">壹家店</option>
									</select>
								</div>
							</div>
					<div class="row">
						<div class="col-md-6">
								<!-- BOX-->
								<div class="box border lite" >
									<div class="box-title">
										<h4><i class="fa fa-bars"></i>微信菜单信息</h4>
									</div>
									
									<div class="box-body menus big " style="height:500px;display:flex">
									  <!-- <ul style="width: 160px;padding-left:0px" class="base">	
										<li style="list-style-type:none;">
												<div class="alert alert-block alert-info fade in " >
												<a class="close">&times;</a>
												<p linkUrl="">壹果商城</p>
											  </div>
											<ul style="list-style-type:none;padding-left:10px">
												<li>
												<div class=" alert alert-block alert-info fade in">
												<a class="close">&times;</a>
												<p linkUrl="">今日秒杀1</p>
											    </div>
											    </li>
												<li><div class="alert alert-block alert-info fade in ">
												<a class="close">&times;</a>
												<p linkUrl="">今日秒杀2</p>
											   </div>
											    </li>
											    <li>
												<button class="btn btn-primary" type="button">添加子菜单</button>
											   </li>
											</ul>
										  </li>
										  <button class="btn btn-warning" type="button" style="display:none">添加一级菜单</button>
										</ul>
										 <ul style="width: 200px" class="base">								
											
												<li style="list-style-type:none;">
												<div class=" alert alert-block alert-info fade in " >
												<a class="close">&times;</a>
												<p linkUrl="">今日秒杀</p>
											  </div>
												<ul style="list-style-type:none;padding-left:10px">
												<li>
												<div class="alert alert-block alert-info fade in">
												<a class="close" >&times;</a>
												<p linkUrl="">今日秒杀1</p>
											</div></li>
												<li><div class=" alert alert-block alert-info fade in ">
												<a class="close">&times;</a>
												<p linkUrl="">今日秒杀2</p>
											</div>
											</li>
											<li>
												
												<button class="btn btn-primary" type="button">添加子菜单</button>
											
											</li>
											</ul>
										    </li>
										    <button class="btn btn-warning" type="button" style="display:none">添加一级菜单</button>
										</ul>
										 <ul style="width: 200px" class="base">					
											<li style="list-style-type:none;">
												<div class="alert alert-block alert-info fade in " >
												<a class="close">&times;</a>
												<p linkUrl="">关于壹果</p>
											  </div>
												<ul style="list-style-type:none;padding-left:10px">
												<li>
												<div class="alert alert-block alert-info fade in">
												<a class="close">&times;</a>
												<p linkUrl="">今日秒杀1</p>
											</div></li>
												<li><div class="alert alert-block alert-info fade in ">
												<a class="close">&times;</a>
												<p linkUrl="">今日秒杀2</p>
											</div>
											</li>
											<li>
											<button class="btn btn-primary" type="button">添加子菜单</button>
											</li>
											</ul>
										    </li>
										    <button class="btn btn-warning" type="button" style="display:none">添加一级菜单</button>
										</ul> -->
									</div>
									
								</div>
							</div>
								<!-- /BOX -->
						
						<div class="col-md-6">
						<div class="box border lite">
									<div class="box-title">
										<h4><i class="fa fa-bars"></i>菜单信息</h4>
										
									</div>
									<div class="box-body big">
									<div class="row">
											<label class="control-label col-md-3" style="line-height:34px;">菜单类型：</label>
										    <div class="col-md-6">
										  <select  id="type" class="col-md-12 select2-offscreen" tabindex="-1">
											<option value='view'>微信</option>
											<option value='miniprogram'>小程序</option>
											</select>
																    
										    </div>
										</div>
										<div class="row">
											<label class="control-label col-md-3" style="line-height:34px;">菜单名称：</label>
										    <div class="col-md-6">
										    <input type="text" class="form-control" name="menuName"/>									    
										    </div>
										</div>
										<div class="row">
											<label class="control-label col-md-3" style="line-height:34px;">页面地址：</label>
										    <div class="col-md-6">
										    <textarea  rows=3 cols=15 name="linkUrl" class="form-control" style="resize:none"></textarea>									    
										    </div>
										</div>
									
										<div class="row" style="text-align:center;margin-top:20px">
											<button type="button" class="btn btn-success" >保存</button>
										    
										</div>
									</div>
									</div>
									
									<button type="button" class="btn btn-success" name="publish">发布菜单</button>
								</div>
								<!-- /BOX -->
						</div>
					</div>
				    
				    </div>

			       </div>
               </div>
			</div>
		
	</section>

</body>
	<script src="../../js/jquery/jquery-2.0.3.min.js"></script>
<!-- JQUERY UI-->
		<script src="../../js/jquery-ui-1.10.3.custom/js/jquery-ui-1.10.3.custom.min.js"></script>
		<!-- BOOTSTRAP -->
		<script src="../../bootstrap-dist/js/bootstrap.min.js"></script>
		<!-- SLIMSCROLL -->
	<script type="text/javascript" src="../../js/jQuery-slimScroll-1.3.0/jquery.slimscroll.min.js"></script>
	<script type="text/javascript" src="../../js/jQuery-slimScroll-1.3.0/slimScrollHorizontal.min.js"></script>
		<!-- BLOCK UI -->
		<script type="text/javascript" src="../../js/jQuery-BlockUI/jquery.blockUI.min.js"></script>
		<!--bootbox-->
		<script type="text/javascript" src="../../js/bootbox/bootbox.min.js"></script>
		<!-- AUTOSIZE -->
		<script type="text/javascript" src="../../js/autosize/jquery.autosize.min.js"></script>
		<!-- spinner -->
		<script src="../../js/spinner/spin.js"></script>
		<!-- bootstrap-fileupload -->
		<script type="text/javascript" src="../../js/jquery-upload/js/jquery.iframe-transport.js"></script>
		<script type="text/javascript" src="../../js/jquery-upload/js/jquery.fileupload.min.js"></script>
		<script type="text/javascript" src="../../js/jquery-upload/js/jquery.fileupload-process.min.js"></script>
		<script type="text/javascript" src="../../js/jquery-upload/js/jquery.fileupload-validate.min.js"></script>

		<!-- INPUT MASK -->
		<script type="text/javascript" src="../../js/bootstrap-inputmask/bootstrap-inputmask.min.js"></script>

		<!-- SELECT2 -->
		<script type="text/javascript" src="../../js/select2/select2.min.js"></script>
		<!-- UNIFORM -->
		<script type="text/javascript" src="../../js/uniform/jquery.uniform.min.js"></script>
		<!-- WIZARD -->
		<script src="../../js/bootstrap-wizard/jquery.bootstrap.wizard.min.js"></script>
		<!-- WIZARD -->
		<script src="../../js/jquery-validate/jquery.validate.min.js"></script>
		<script src="../../js/jquery-validate/additional-methods.min.js"></script>
		<script src="../../js/bootstrap-wizard/form-wizard.js"></script>
		<!-- NESTABLE LISTS -->
		<script type="text/javascript" src="../../js/nestable/jquery.nestable.min.js"></script>
		<!-- COOKIE -->
		<script type="text/javascript" src="../../js/jQuery-Cookie/jquery.cookie.min.js"></script>
		<!-- CUSTOM SCRIPT -->
		<script src="../../js/script.js"></script>
		<script src="../../js/common.js"></script>
		<script src="../../js/Sortable.min.js"></script>
		<script>
            var platformNo,smallAppId;
			var Home = function() {
				var close=function(){
					$(".close").unbind("click").click(function(){
						if($(this).closest("ul").find("li").length==1)
							$(this).closest("ul").find("button").show();
						if($(this).closest("ul").find(".alert").length-1<5)
							$(this).closest("ul").find("button").show();
						$(this).parent().parent().remove();
						
					});
				}
				var addFirstMenu=function(){
					$("[name=menuName]").val("菜单名称");
					var str='<li style="list-style-type:none;">'+
						'<div class="alert alert-block alert-info fade in " >'+
						'<a class="close">&times;</a>'+
						'<p>一级菜单名称</p>'+
				 		 '</div>'+
						'<ul style="list-style-type:none;padding-left:10px">'+
						'<li><button class="btn btn-primary" type="button">添加子菜单</button></li></ul></li>';
					$(this).before(str);
					$(this).hide();
					$(".border").find(".btn-primary").click(addSecondMenu);

                    var base = '<ul style="width: 160px;padding-left:10px" class="base">' +
						'<button class="btn btn-warning" type="button" style="display:block">添加一级菜单</button></ul>';
                    $(".menus").append(base);
                    $(".btn-warning").unbind("click").click(addFirstMenu);

					getMenuInfo();
				}
				var addSecondMenu=function(){
						$("[name=menuName]").val("子菜单名称");
						var str='<li><div class="alert sub alert-block alert-info fade in ">'+
								'<a class="close">&times;</a>'+
								'<p>子菜单名称</p></div></li>';
						$(this).parent().before(str)
						close();
						if($(this).closest("ul").find("li").length-1==5)
							$(this).hide();
						getMenuInfo();
					
				}
				var getMenuInfo=function(){
					$(".border").find("p").unbind("click").click(function(){
						$("p").css("color","");
						$("p").removeAttr("name");
                        var type = $(this).attr("type");

                        $("#type").select2('val',type);
						$("[name=menuName]").val($(this).html());
						if (type === 'miniprogram') {
                            $("[name=linkUrl]").val('');
						} else {
                            $("[name=linkUrl]").val($(this).attr("linkUrl"));
						}


						$(this).css("color","red");
						$(this).attr("name","current");
					})
				}
				var saveMenu=function(){
					$(".btn-success").click(function(){
						$("p[name=current]").html($("[name=menuName]").val()).attr("linkUrl",$("[name=linkUrl]").val());
						
						$("p[name=current]").attr("type",$("#type").val()||"view");
						$("[name=menuName]").val('');
						$("[name=linkUrl]").val('');
					});
				}
				var publish=function(){
					var menus=[];
					var menusButton={};
					$.each($(".box-body").find(".base"),function(index,item){
						//获取一级菜单
					
					if($(item).find("p").length>0){
						var button={};
						button.name=$(item).find("p:eq(0)").html();
						
						var type =$(item).find("p:eq(0)").attr("type");
						var url=$(item).find("p:eq(0)").attr("linkurl");
						if(type!="null" &&url!=""){
							button.type=type;
							button.url=url;
						}
						if(type==="miniprogram"){
							 button.type=type;
							 button.url="http://m.yiigoo.com",
							 button.appid=smallAppId;
	                         button.pagepath=$(item).find("p:eq(0)").attr("linkurl").trim();
						}
							
						//获取子菜单
						
						 if($(item).find("div.sub").length>0){	
							 button.sub_button=[];		
							$.each($(item).find("div.sub"),function(m,n){
								var sub={};
								sub.name=$(n).find("p").html();
								sub.type=$(n).find("p").attr("type");
								sub.url=$(n).find("p").attr("linkurl");
								if(sub.type==="miniprogram"){
									sub.url="http://m.yiigoo.com",
									sub.appid=smallAppId;
									sub.pagepath=$(n).find("p").attr("linkurl").trim();
								}
								button.sub_button.push(sub);
							});
							menus.push(button);
						}else 
							menus.push(button);
						
						
					 }
					});
					menusButton.button=menus;

				$.confirm("确认更新公众号的菜单吗?",function(){
					$.ajax({
						type: "post",
						url: App.getContextPath() + "admin/template/publishCustomMenu.do",
						data:{menus:JSON.stringify(menusButton), platformNo:platformNo},
						async: true,
						success: function(result) {
							if(result.type==="success")
								$.alert("更新成功");
						}
						
					});
					
				});
					
				}
				var getMenus=function(){
                    platformNo = $("#platformNo").val();
					$.ajax({
						type: "post",
						url: App.getContextPath() + "admin/template/getAllMenu.do?platformNo="+platformNo,
						async: true,
						success: function(message) {
                            $(".menus").empty();
						    if (message.type === 'success') {
						        smallAppId = message.extra.smallAppId;
						        var result = message.extra.menuList;

                                var base="";
                                if (result != null && result.length > 0) {
                                    $.each(result[0].buttons,function(index,item){
                                        base+='<ul style="width: 160px;padding-left:10px" class="base">'+
                                            '<li style="list-style-type:none;">'+
                                            '<div class="alert alert-block alert-info fade in ">'+
                                            '<a class="close">×</a>'+
                                            '<p linkurl='+item.content+' type='+item.type+'>'+item.name+'</p>'+
                                            '</div>';
                                        var subs="";
                                        if(item.subs.length>0){
                                            $.each(item.subs,function(m,n){
                                                subs+='<li>'+
                                                    '<div class="alert sub alert-block alert-info fade in">'+
                                                    '<a class="close">×</a>'+
                                                    '<p linkurl='+n.content+' type='+n.type+'>'+n.name+'</p>'+
                                                    '</div></li>';
                                            });

                                        }

                                        base+='	<ul style="list-style-type:none;padding-left:10px">'+subs+

                                            '	<li>'+
                                            '<button class="btn btn-primary" type="button">添加子菜单</button>'+
                                            '</li>'+
                                            '</ul>'+
                                            '</li><button class="btn btn-warning" type="button" style="display:none">添加一级菜单</button></ul>';

                                    });
								}
								base += '<ul style="width: 160px;padding-left:10px" class="base"><button class="btn btn-warning" type="button" style="display:block">添加一级菜单</button></ul>';

                                $(".menus").append(base);
                                close();
                                $(".btn-warning").unbind("click").click(addFirstMenu);
                                $(".border").find(".btn-primary").unbind("click").click(addSecondMenu);
                                getMenuInfo();
                            }
						}
						
					});
				}
				return {
					init:function(){
						saveMenu();
						close();
						$("#type").select2();
						$("#platformNo").select2();
                        platformNo = $("#platformNo").val();
                        $("#platformNo").change(getMenus);
						$(".btn-warning").unbind("click").click(addFirstMenu);
						$(".border").find(".btn-primary").click(addSecondMenu);
						$("[name=publish]").unbind().click(publish);
						getMenuInfo();
						getMenus();
					}
				}
			}();
			$(function() {
			    $("#header").load("../head.html");
			    App.init();
			    Home.init();
			});
			
			</script>
			

</html>